import './css/bg_rw_wd.css'
import { Select } from 'antd';
import React, { useState, useEffect } from 'react';
import axios from 'axios';
let Bg_rw_sx = function(){
    const { Option } = Select;
    const [data, setData] = useState([]);
    const [data1, setData1] = useState([]);
    const [val,setval] = useState('')
    var status=1
    var priority='all'
    var limit=15
    var page=1
    var search=''
    var type=''
    var stop_type='' 


    useEffect(() => {
        const FetchData = async () => {
            const result = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/myTask',{
                    status: status,
                    priority: priority,
                    limit: limit,
                    page: page,
                    search: search,
                }
            );
            setData(result.data.data.list);
        };
        FetchData();
            const FetchData1 = async () => {
                const result = await axios.post(
                    'http://crm.cimns.com/index.php/admin/users/getUserList'
                );
            
                setData1(result.data.data)
            };
            FetchData1();
    }, []);
    
    function HandleChange(value) {
        type=value
        const FetchData = async () => {
            const result1 = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/myTask',{
                    status: status,
                    priority: priority,
                    limit: limit,
                    page: page,
                    search: search,
                    type:type
                }
            );
            setData(result1.data.data.list);
        };
        FetchData();
    }
    function HandleChange1(value1) {
        status=value1
        const FetchData = async () => {
            const result1 = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/myTask',{
                    status: status,
                    priority: priority,
                    limit: limit,
                    page: page,
                    search: search,
                    type:type,
                    status:status
                }
            );
            setData(result1.data.data.list);
        };
        FetchData();
    }
    function HandleChange2(value2) {
        priority=value2
        const FetchData = async () => {
            const result1 = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/myTask',{
                    status: status,
                    priority: priority,
                    limit: limit,
                    page: page,
                    search: search,
                    type:type,
                    status:status,
                }
            );
            setData(result1.data.data.list);
        };
        FetchData();
    }
    function HandleChange3(value3) {
        stop_type=value3
        const FetchData = async () => {
            const result1 = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/myTask',{
                    status: status,
                    priority: priority,
                    limit: limit,
                    page: page,
                    search: search,
                    type:type,
                    status:status,
                    stop_type:stop_type
                }
            );
            setData(result1.data.data.list);
        };
        FetchData();
    }
    function sc(index){
        const FetchData = async () => {
            const result = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/taskOver',{
                    task_id:data[index].task_id,
                    type:1
                }
            );
            data.splice(index,1)
            let data1=[...data]
            setData(data1)
        };
        FetchData();
        
        
    }
    for (let i = 0; i < data.length; i++) {
        if (data[i].main_user.img === '') {
          data[i].main_user.img = 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg14.360buyimg.com%2Fn7%2Fg13%2FM09%2F10%2F0D%2FrBEhU1LLc4kIAAAAAAQGJG9xXH8AAHq5QBy3P0ABAY8782.jpg&refer=http%3A%2F%2Fimg14.360buyimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1620799578&t=08a4940bc6d0d409c6a13cdc8765970f'
        }
    };console.log(data);
    function valchange(event){
        let str = event.target.value
        parseInt(str)
        const FetchData = async () => {
            const result = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/myTask',{
                    status: 1,
                    priority: 'all',
                    limit: 15,
                    page: 1,
                    search: str,
                }
            );
            console.log(result.data);
            setData(result.data.data.list)
        };
        FetchData();
        setval(str)
    }
    
        
        
    return(
        <div className="wd">
           <div className="input">
               <input placeholder="搜索任务名称" value={val} onChange={valchange}/>
           </div>
           <ul className="clearfix">
               <li>
                   <span>任务类型</span>
                    <Select defaultValue="" style={{ width: 120 }} onChange={HandleChange}>
                        {/* type */}
                        <Option value="">全部</Option>
                        <Option value="mymain">我负责的</Option>
                        <Option value="mycreate">我创建的</Option>
                        <Option value="myown">我参与的</Option>
                    </Select>
               </li>
               <li>
                   <span>状态</span>
                    <Select defaultValue="1" style={{ width: 120 }} onChange={HandleChange1}>
                    {/* status */}
                        <Option value="">全部</Option>
                        <Option value="1">正在进行</Option>
                        <Option value="5">已完成</Option>
                    </Select>
               </li>
               <li>
                   <span>优先级</span>
                    <Select defaultValue="all" style={{ width: 120 }} onChange={HandleChange2}>
                    {/* priority */}
                        <Option value="all">全部</Option>
                        <Option value="3">高</Option>
                        <Option value="2">中</Option>
                        <Option value="1">低</Option>
                        <Option value="0">无</Option>
                    </Select>
               </li>
               <li>
                   <span>截止时间</span>
                    <Select defaultValue="" style={{ width: 120 }} onChange={HandleChange3}>
                    {/* stop_type: */}
                        <Option value="">全部</Option>
                        <Option value="1">今天到期</Option>
                        <Option value="2">明天到期</Option>
                        <Option value="3">一周到期</Option>
                        <Option value="4">一个月到期</Option>
                    </Select>
               </li>
               <li>
                   <span>负责人</span>
                    <Select defaultValue="" style={{ width: 120 }} onChange={HandleChange3} >
                    {/* stop_type: */}
                        <Option value="">全部</Option>
                        {data1.map((item,index)=>{
                            return(
                                <Option key={index} value={item.realname} label={item.realname}>
                                            
                                </Option>
                            )
                                        
                        })}
                    </Select>
               </li>
           </ul>
           <div>
               {data.map((item,index)=>{
                   return(
                       <div key={index} className='xxr clearfix'>
                           <span onClick = {()=>{sc(index)}}></span>
                           <p>{item.task_name}</p>
                           <div>
                               <span>{item.stop_time}    截止时间</span>
                               <img alt="00" src={item.main_user.img} />
                           </div>
                       </div>
                   )
               })}
           </div>
           <div>没有更多啦</div>
           
        </div>
        
    )
}
export default Bg_rw_sx
